//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    scale: 18,
    latitude: 0,
    longitude: 0,
    markers: []
  },
  onLoad: function (options) {
    //1、初始化 options 为页面跳转所带来的参数
    this.timer = options.timer;
    // 2、调用wx.getLocation
    wx.getLocation({
      type: 'gcj02',
      success: (res) => {
        // console.log(res)

        this.setData({
          longitude: res.longitude,
          latitude: res.latitude
        })
      }
    })
    // 3、设置地图控件的位置和大小，通过设备宽高定位
    wx.getSystemInfo({
      success: (res) => {
        // console.log(res)
        this.setData({
          controls: [{
            id: 1,
            iconPath: '/images/location.png',
            position: {
              let: 20,
              top: res.windowHeight - 80,
              width: 50,
              height: 50
            },
            clickable: true
          }, {
            id: 2,
            iconPath: '/images/use.png',
            position: {
              left: res.windowWidth / 2 - 45,
              top: res.windowHeight - 100,
              width: 90,
              height: 90
            },
            clickable: true
          }, {
            id: 3,
            iconPath: '/images/warn.png',
            position: {
              left: res.windowWidth - 70,
              top: res.windowHeight - 80,
              width: 50,
              height: 50
            },
            clickable: true
          },
          {
            id: 4,
            iconPath: '/images/marker.png',
            position: {
              left: res.windowWidth / 2 - 11,
              top: res.windowHeight / 2 - 45,
              width: 22,
              height: 45
            },
            clickable: false
          },
          {
            id: 5,
            iconPath: '/images/avatar.png',
            position: {
              left: res.windowWidth - 68,
              top: res.windowHeight - 155,
              width: 45,
              height: 45
            },
            clickable: true
          }]
        })
      },
    })

    // 4、请求服务器，获取附近的单车
    this.getOfoData()
  },
  getOfoData: function () {
    wx.request({
      url: 'https://easy-mock.com/mock/5afd94011591717d6969546f/example/ofodata/biyclePositon',
      data: {},
      method: 'GET',
      success: (res) => {
        // console.log(res)
        this.setData({
          markers: res.data.data
        })
      }
    })
  },
  bindcontroltap: function (e) {
    // console.log(e)
    switch (e.controlId) {
      // 点击定位控件
      case 1: this.movetoPosition();
        break;
      // 点击立即用车，判断当前是否正在计费，此处只需要知道是调用扫码，后面会讲到这里的判断条件
      case 2: if (this.timer === "" || this.timer === undefined) {
        // 没有在计费就扫码
        wx.scanCode({
          success: (res) => {
            // 正在获取密码通知
            wx.showLoading({
              title: '正在获取密码',
              mask: true // 显示蒙层
            })
            // 请求服务器获取密码和车号
            wx.request({
              url: 'https://www.easy-mock.com/mock/59098d007a878d73716e966f/ofodata/password',
              data: {},
              method: 'GET',
              success: function (res) {
                // 请求密码成功隐藏等待框
                wx.hideLoading();
                // 携带密码和车号跳转到密码页
                wx.redirectTo({
                  url: '../scanresult/index?password=' + res.data.data.password + '&number=' + res.data.data.number,
                  success: function (res) {
                    wx.showToast({
                      title: '获取密码成功',
                      duration: 1000
                    })
                  }
                })
              }
            })
          }
        })
        // 当前已经在计费就回退到计费页
      } else {
        wx.navigateBack({
          delta: 1
        })
      }
        break;
      // 点击保障控件，跳转到报障页
      case 3: wx.navigateTo({
        url: '../warn/index'
      });
        break;
      // 点击头像控件，跳转到个人中心
      case 5: wx.navigateTo({
        url: '../my/index'
      });
        break;
      default: break;
    }
  },
  bindmarkertap: function (e) {
    //地图点击事件
    // console.log(e)
    let _markers = this.data.markers; //拿到标的数组
    let markerIndex = _markers.findIndex((v) => {
      return v.id == e.markerId
    });  // 获取点击标记ID
    let currMaker = _markers[markerIndex];
    // console.log(markerIndex)
    // console.log(_markers)

    this.setData({
      polyline: [{
        points: [{
          longitude: this.data.longitude,
          latitude: this.data.latitude
        }, {
          longitude: currMaker.longitude,
          latitude: currMaker.latitude
        }],
        color: "#FF0000DD",
        width: 1,
        dottedLine: true
      }],
      scale: 18
    })


  },
  bindregionchange: function (e) {
    // 拖动地图时触发事件，请求单车数据
    // console.log(e)
    if (e.type == 'begin') {
      // 拖动开始
      this.getOfoData()
    } else if (e.type == 'end') {
      // 拖动结束
      this.setData({
        markers: this.data.markers
      })
    }
  },
  onReady: function () {
    //页面渲染完成

  },
  onShow: function () {
    //页面显示
    this.mapCtx = wx.createMapContext("ofoMap");
    this.movetoPosition()
    // console.log(this.data)
  },
  movetoPosition: function () {
    this.mapCtx.moveToLocation();
  },
  onHide: function () {
    //页面隐藏
  },
  onUnload: function () {
    //页面关闭
  }
})
